<template>
  <div class="app-container" style="min-height: 600px"  v-loading="loading">
    <div v-if="showInfo==0" align="center;">
      <h1>诊断专家组正在为您定制专属调研问卷,将请期待……</h1>
    </div>
    <div v-else>
    <el-tabs v-model="activeName" @tab-click="handleClick" align="center" tab-position="right"  >
      <el-tab-pane
        v-for="(item, index) in naireList"
        :key="item.nairdId"
        :label="item.name"
        :name="item.name"
      >
        <h1> {{item.name}}</h1>
        {{item.naireDesc}}
        <br>
        <br>
        <br>
        <br>
        <div v-if="status[item.naireId]=='0'||status[item.naireId]=='1'">
        <el-button type="primary" round size="medium " @click="handleBegin(item.naireId)">开始答题   <i class="el-icon-right"/></el-button>
        <el-button type="default" round size="medium " @click="handleOverview(item.naireId)">答题进度   <i class="el-icon-right"/></el-button>
        </div>
        <div v-else>
          <el-result icon="success" title="已经完成答题" subTitle="">

          </el-result>
        </div>
      </el-tab-pane>
    </el-tabs>
    </div>
    <div v-else="naireList.length==1" align="center">
      <h1> {{naireList[0].name}}</h1>
      {{naireList[0].naireDesc}}
      <br>
      <br>
      <br>
      <br>
      <el-button type="primary" round size="medium " @click="handleBegin(naireList[0].naireId)">开始答题   <i class="el-icon-right"/></el-button>

      <el-button type="default" round size="medium " @click="handleOverview(naireList[0].naireId)">答题进度   <i class="el-icon-right"/></el-button>
    </div>
  </div>
</template>

<script>
import { listNaireForCompany} from "@/api/system/naire";

export default {
  name: "NaireList",
  data() {
    return {
      showInfo:-1,
      status:undefined,
      companyId:this.$store.state.user.compId,
      naireList:undefined,
      // 遮罩层
      loading: true,
      activeName: 'second',
    };
  },
  created() {
    this.getList();
  },
  methods: {
    /** 查询问卷数据列表 */
    handleClick(tab, event) {
      console.log(tab, event);
    },

    getList() {
      this.loading = true;
      listNaireForCompany(this.companyId).then(response => {
        this.naireList = response.nairelist;
        this.status=response.status;

        if(this.naireList!=null &&this.naireList!=undefined){
          this.showInfo=this.naireList.length;
          this.activeName=this.naireList[0].name;}
        else
          this.showInfo=0;
        console.log('this.naireList', this.naireList)
        console.log('this.status', this.status)
        this.loading = false;
      });
    },

    handleBegin(naireId) {
      this.$store.dispatch("tagsView/delView", this.$route);
      this.$router.push({name: "showQuestionnaire", query: {'naireId':naireId,'domain':12}})
    },
    handleOverview(naireId) {
      this.$store.dispatch("tagsView/delView", this.$route);
      this.$router.push({name: 'overviewStatus', query: {'naireId':naireId}})
    },
  }
};
</script>


